﻿<UserControl x:Class="Microsoft.Forums.ForumsClient.WaitThrobber"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:LocalApp="clr-namespace:Microsoft.Forums.ForumsClient"             
    Width="{Binding RelativeSource={RelativeSource Self}, Path=Radius}"
    Height="{Binding RelativeSource={RelativeSource Self}, Path=Radius}">
    <UserControl.Resources>
        <Storyboard x:Key="Throb">
            <DoubleAnimation
            Storyboard.TargetName="ThrobberElement"
            Storyboard.TargetProperty="(Ellipse.RenderTransform).(RotateTransform.Angle)"
            From="0"
            To="360"
            Duration="0:0:0.9"
            RepeatBehavior="Forever" />
        </Storyboard>
        <Style TargetType="{x:Type LocalApp:WaitThrobber}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type LocalApp:WaitThrobber}">
                        <Canvas Background="Transparent">
                            <Ellipse x:Name="ThrobberElement"
                              Visibility="Hidden"
                              Canvas.Top="0"
                              Canvas.Left="0"
                              Fill="#FFFFFFFF"
                              Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Radius}"
                              Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Radius}"
                              StrokeThickness="4">
                                <Ellipse.Stroke>
                                    <RadialGradientBrush 
                                     GradientOrigin="0.85,0.15" Center="0.5,0.5" 
                                     RadiusX="0.5" RadiusY="0.5">
                                        <GradientStop Color="White" Offset="0" />
                                        <GradientStop Color="Green" Offset="1" />
                                    </RadialGradientBrush>
                                </Ellipse.Stroke>
                                <Ellipse.RenderTransform>
                                    <RotateTransform x:Name="RotateTransformElement" Angle="0" />
                                </Ellipse.RenderTransform>
                            </Ellipse>
                        </Canvas>
                        <ControlTemplate.Triggers>
                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Throb}" Value="True">
                                <DataTrigger.Setters>
                                    <Setter TargetName="ThrobberElement"  Property="Visibility" Value="Visible" />
                                </DataTrigger.Setters>
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard Storyboard="{StaticResource Throb}" Name="ThrobAnimation" />
                                </DataTrigger.EnterActions>
                                <DataTrigger.ExitActions>
                                    <StopStoryboard BeginStoryboardName="ThrobAnimation" />
                                </DataTrigger.ExitActions>
                            </DataTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <!--The entire control is rendered by the control template definition in the Resources section above-->
</UserControl>
